<%-- 
    Document   : index
    Created on : Dec 15, 2014, 3:43:54 PM
    Author     : Tran Thuy Duong
--%>

<%@page contentType="text/html" pageEncoding="UTF-8"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<title>Handmade</title>
	<link rel="stylesheet" type="text/css" href="css/style.css"/>
	<link rel="stylesheet" type="text/css" href="css/navigation.css"/>
	<link rel="stylesheet" type="text/css" href="css/center_content.css"/>
	<link rel="stylesheet" type="text/css" href="css/footer.css"/>
	<link rel="stylesheet" type="text/css" href="css/menu_tab.css"/>
	<link rel="stylesheet" type="text/css" href="css/showslides.css"/>
	 <script
            src="http://maps.googleapis.com/maps/api/js">
        </script>
	<script type="text/javascript" src="js/showslides.js"></script> 

	<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script> 
	<script type="text/javascript" src="js/tooltip.js"></script>
        <script>
            // Load Login
        function loadLogin()
        {
        var xmlhttp;
        if (window.XMLHttpRequest)
          {// code for IE7+, Firefox, Chrome, Opera, Safari
          xmlhttp=new XMLHttpRequest();
          }
        else
          {// code for IE6, IE5
          xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
          }
        xmlhttp.onreadystatechange=function()
          {
          if (xmlhttp.readyState==4 && xmlhttp.status==200)
            {
            document.getElementById("center_content").innerHTML=xmlhttp.responseText;
            }
          }
        xmlhttp.open("GET","Login.jsp",true);
        xmlhttp.send();
        }
            // Load Register
         function loadRegister(location)
        {
        window.location=location;
        }
        
       
         function loadPro_Detail_new()
        {
        var xmlhttp;
        if (window.XMLHttpRequest)
          {// code for IE7+, Firefox, Chrome, Opera, Safari
          xmlhttp=new XMLHttpRequest();
          }
        else
          {// code for IE6, IE5
          xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
          }
        xmlhttp.onreadystatechange=function()
          {
          if (xmlhttp.readyState==4 && xmlhttp.status==200)
            {
            document.getElementById("center_content").innerHTML=xmlhttp.responseText;
            }
          }
          var masp = document.pro_box_new.masp.value;
        xmlhttp.open("GET","C_Pro_Account?ProAction=detail&masp=" + masp,true);
        xmlhttp.send();
        }
        
         function loadPro_Detail_pmt()
        {
        var xmlhttp;
        if (window.XMLHttpRequest)
          {// code for IE7+, Firefox, Chrome, Opera, Safari
          xmlhttp=new XMLHttpRequest();
          }
        else
          {// code for IE6, IE5
          xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
          }
        xmlhttp.onreadystatechange=function()
          {
          if (xmlhttp.readyState==4 && xmlhttp.status==200)
            {
            document.getElementById("center_content").innerHTML=xmlhttp.responseText;
            }
          }
          var masp = document.pro_box_pmt.masp.value;
        xmlhttp.open("GET","C_Pro_Account?ProAction=detail&masp=" + masp,true);
        xmlhttp.send();
        }
        function loadHMLamDep()
        {
            
             var xmlhttp;
        if (window.XMLHttpRequest)
          {// code for IE7+, Firefox, Chrome, Opera, Safari
          xmlhttp=new XMLHttpRequest();
          }
        else
          {// code for IE6, IE5
          xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
          }
        xmlhttp.onreadystatechange=function()
          {
          if (xmlhttp.readyState==4 && xmlhttp.status==200)
            {
            document.getElementById("center_content").innerHTML=xmlhttp.responseText;
            }
          }
          
        xmlhttp.open("GET","C_Pro_Account?ProAction=ShowDMSP&dmsp=HMLD",true);
        xmlhttp.send();
        }
        
        function loadBepHM(){
              var xmlhttp;
        if (window.XMLHttpRequest)
          {// code for IE7+, Firefox, Chrome, Opera, Safari
          xmlhttp=new XMLHttpRequest();
          }
        else
          {// code for IE6, IE5
          xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
          }
        xmlhttp.onreadystatechange=function()
          {
          if (xmlhttp.readyState==4 && xmlhttp.status==200)
            {
            document.getElementById("center_content").innerHTML=xmlhttp.responseText;
            }
          }
          
        xmlhttp.open("GET","C_Pro_Account?ProAction=ShowDMSP&dmsp=BHM",true);
        xmlhttp.send();
        }
        function loadQuaTangHM(){
              var xmlhttp;
        if (window.XMLHttpRequest)
          {// code for IE7+, Firefox, Chrome, Opera, Safari
          xmlhttp=new XMLHttpRequest();
          }
        else
          {// code for IE6, IE5
          xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
          }
        xmlhttp.onreadystatechange=function()
          {
          if (xmlhttp.readyState==4 && xmlhttp.status==200)
            {
            document.getElementById("center_content").innerHTML=xmlhttp.responseText;
            }
          }
          
        xmlhttp.open("GET","C_Pro_Account?ProAction=ShowDMSP&dmsp=QTHM",true);
        xmlhttp.send();
        }
       
        function showduoi50()
        {
        var xmlhttp;
        if (window.XMLHttpRequest)
          {// code for IE7+, Firefox, Chrome, Opera, Safari
          xmlhttp=new XMLHttpRequest();
          }
        else
          {// code for IE6, IE5
          xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
          }
        xmlhttp.onreadystatechange=function()
          {
          if (xmlhttp.readyState==4 && xmlhttp.status==200)
            {
            document.getElementById("center_content").innerHTML=xmlhttp.responseText;
            }
          }
        xmlhttp.open("GET","C_Pro_Account?ProAction=Giaban&gia=duoi50",true);
        xmlhttp.send();
        }
        
        function showtren150()
        {
        var xmlhttp;
        if (window.XMLHttpRequest)
          {// code for IE7+, Firefox, Chrome, Opera, Safari
          xmlhttp=new XMLHttpRequest();
          }
        else
          {// code for IE6, IE5
          xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
          }
        xmlhttp.onreadystatechange=function()
          {
          if (xmlhttp.readyState==4 && xmlhttp.status==200)
            {
            document.getElementById("center_content").innerHTML=xmlhttp.responseText;
            }
          }
        xmlhttp.open("GET","C_Pro_Account?ProAction=Giaban&gia=tren150",true);
        xmlhttp.send();
        }
        
        function show50150()
        {
        var xmlhttp;
        if (window.XMLHttpRequest)
          {// code for IE7+, Firefox, Chrome, Opera, Safari
          xmlhttp=new XMLHttpRequest();
          }
        else
          {// code for IE6, IE5
          xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
          }
        xmlhttp.onreadystatechange=function()
          {
          if (xmlhttp.readyState==4 && xmlhttp.status==200)
            {
            document.getElementById("center_content").innerHTML=xmlhttp.responseText;
            }
          }
        xmlhttp.open("GET","C_Pro_Account?ProAction=Giaban&gia=50150",true);
        xmlhttp.send();
        }
        
        
        function load_NewsCenter()
        {
        var xmlhttp;
        if (window.XMLHttpRequest)
          {// code for IE7+, Firefox, Chrome, Opera, Safari
          xmlhttp=new XMLHttpRequest();
          }
        else
          {// code for IE6, IE5
          xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
          }
        xmlhttp.onreadystatechange=function()
          {
          if (xmlhttp.readyState==4 && xmlhttp.status==200)
            {
            document.getElementById("center_content").innerHTML=xmlhttp.responseText;
            }
          }
        xmlhttp.open("GET","C_Show_CenterNews",true);
        xmlhttp.send();
        }
        
        
        <script
        src="http://maps.googleapis.com/maps/api/js">
        </script>
        

    <script>
        var myCenter=new google.maps.LatLng(10.870065, 106.803875);

        function initialize()
        {
        var mapProp = {
          center:myCenter,
          zoom:15,
          mapTypeId:google.maps.MapTypeId.ROADMAP
          };

        var map=new google.maps.Map(document.getElementById("googleMap"),mapProp);

        var marker=new google.maps.Marker({
          position:myCenter,
          });

        marker.setMap(map);

        var infowindow = new google.maps.InfoWindow({
          content:"HandMade!"
          });

        google.maps.event.addListener(marker, 'click', function() {
          infowindow.open(map,marker);
          });
        }

        google.maps.event.addDomListener(window, 'load', initialize);
    
    </script>

</head>

    <body>
<div class="main">
	<div class="bg_topmenu">
		<div id="TopMenu">
							
			<ul>
			
				<li class="First topMenu_Account">
					<a onclick="loadLogin();">
						Tài khoản của tôi
					</a>
				</li>
				<li class="topMenu_Order">
					<a href="#">
						Quản lý đơn hàng
					</a>
				</li>
				<li class="topMenu_Wishlist">
					<a onclick="loadLogin();">
						Danh sách ưa thích
					</a>
				</li>
				<li class="CartLink topMenu_Cart">
					<a onclick="loadLogin();">
						Giỏ hàng
						<span id="pInTop"></span>
					</a>
				</li>
				
				<li class="topMenu_Login">
                                    <a onclick="loadLogin();">
						Đăng nhập
					</a>
				</li>
				<li class="topMenu_Register">
                                    <a onclick="loadRegister('Register.jsp')">
						Đăng ký
					</a>
				</li>
                               
				
			</ul>

		</div>
	</div>

	
	<div id="Header">
	</div>
	
		
	<!--Begin Menu tab-->
		
			<div id="menu_tab">
				<div class = "left_menu_content"></div>
				<ul class="menu">
					<li><a href="#" id="nav_home" class="active"><span>Trang chủ</span></a></li>
					<li class = "divider"></li>
					<li><a href="#" id="nav_introduce"><span>Giới thiệu</span></a></li>
					<li class = "divider"></li>
					<li><a href="#" id="nav_product"><span>Sản phẩm</span></a></li>
					<li class = "divider"></li>
                                        <li><a onclick="load_NewsCenter()" id="nav_news"><span>Tin tức</span></a></li>
					<li class = "divider"></li>
					<li><a href="#" id="nav_contact"><span>Liên hệ</span></a></li>
					<li class = "divider"></li>
                                        <li><a onclick="load_Map()" id="nav_map"><span>Bản đồ</span></a></li>	
					<li class = "divider"></li>				
				</ul>
				<div id="search_form">
					<input name="" type="text" id="" class="search_input" onkeydown="return keyDownHandler">
					<input name="" type="submit" id="" class="search_button" value onclick="OnSearchClick()">
				</div>		
		
		</div>
		<!--End Menu tab-->
	
	<!-- Content: Start -->
	<div id="Wrapper">
	
		<!-- Navigation: Start -->
		<div class="navigation">
			Navigation: <span class="current"> Home </span>
		</div>
		<!-- Navigation: End -->
		
		
		<!-- Left: Start -->
		<div id="PaneLeft">
			<div id="PaneLeft_1">
				<div id="PaneLeft_header">
					<p>SẢN PHẨM</p>
				</div>
					
				<div class="content">
					<div class="product">
						<div class="product_istar"></div>
						<div class="product_name">
							<a onclick="loadHMLamDep()" >
								<p>HANDMADE LÀM ĐẸP<p>
							</a>
						</div>
					</div>
				</div>
				
				
				
				<div class="content">
					<div class="product">
						<div class="product_istar"></div>
						<div class="product_name">
							<a onclick="loadBepHM();">
								<p>BẾP HANDMADE<p>
							</a>
						</div>
					</div>
				</div>
				
				<div class="content">
					<div class="product">
						<div class="product_istar"></div>
						<div class="product_name">
							<a onclick="loadQuaTangHM();">
								<p>QUÀ TẶNG HANDMADE<p>
							</a>
						</div>
					</div>
				</div>
				
				
				
				<div class="footer">
				</div>
			</div>
				
			<div id="PaneLeft_1">
				<div id="PaneLeft_header">
					<p>TÌM THEO GIÁ</p>
				</div>
					
				<div class="content">
					<div class="product">
						<div class="product_iprice"></div>
						<div class="product_name">
							<a onclick="showduoi50()">
								<p>DƯỚI 50.000<p>
							</a>
						</div>
					</div>
				</div>
				
				<div class="content">
					<div class="product">
						<div class="product_iprice"></div>
						<div class="product_name">
                                                    <a onclick="show50150()">
								<p>50.000 - 150.000<p>
							</a>
						</div>
					</div>
				</div>
				
				
				
				
				
				<div class="content">
					<div class="product">
						<div class="product_iprice"></div>
						<div class="product_name">
							<a onclick="showtren150()">
								<p>TRÊN 150.000<p>
							</a>
						</div>
					</div>
				</div>
				
				<div class="footer">
				</div>
			</div>
				
			<div id="PaneLeft_1">
				<div id="PaneLeft_header">
					<p>HỖ TRỢ</p>
				</div>
					
				<div class="content">
					<div class="product">
						<div class="product_ihelp"></div>
						<div class="product_name">							
							<p>Tư vấn hỗ trợ:<p>	
							<ul>
								<p>Số điện thoại: 0123xxxxxxxx</p>
								<p>Email:</p>
								<a href="#">
									<p>handmadettd@gmail.com</p>
								</a>								
							</ul>													
						</div>
					</div>					
				</div>	
				
				<div class="footer">
				</div>
			</div>
			
			<div id="PaneLeft_1">
				<div id="PaneLeft_header">
					<p>LƯỢT TRUY CẬP</p>
                                        
				</div>
					
				<div class="content">
					<div class="product">						
							<p>Đang trục tuyến: </p>
							<p>Hôm qua: </p>	
							<p>Hôm nay: </p>	
							<p>Tất cả: </p>						
					</div>					
				</div>	
				
				<div class="footer">
				</div>
			</div>				
		</div>
		<!-- Left: End -->
		
		<!-- Center: Start -->
			<div class="center_content" id="center_content">
				<div class="center_title_bar">
							SẢN PHẨM MỚI
				</div>
				<div id="googleMap" style="width:510px;height:380px;"></div>
				
				
			</div>
                                                
		<!-- Center: End -->

		<!-- Right: Start -->
		<div id="PaneRight">
			<div id="PaneRight_1">
				<div id="PaneRight_header">
					<p>GIỎ HÀNG</p>
				</div>
				<div class="content">
					<p>Chưa có sản phẩm nào trong giỏ hàng của bạn!<p>
				</div>
				<div class="footer">
				</div>
			</div>
			
			<div id="PaneRight_1">
				<div id="PaneRight_header">
						<p>SẢN PHẨM BÁN CHẠY</p>
				</div>
				<div class="content">
					<div class="product">
						<div class="product_number">1</div>
						<div class="product_name"><a href="#"><p>THỎ BÔNG<p></a></div>
						<div class="product_price"><p>80.000đ<p></div>
					</div>
					
					<div class="product">
						<div class="product_number">2</div>
						<div class="product_name"><a href="#"><p>VÒNG MIXED CÁ TÍNH<p></a></div>
						<div class="product_price"><p>50.000đ<p></div>
					</div>
					
					<div class="product">
						<div class="product_number">3</div>
						<div class="product_name"><a href="#"><p>HOA VẢI YÊU THƯƠNG<p></a></div>
						<div class="product_price"><p>110.000đ<p></div>
					</div>
				</div>
				<div class="footer">
				</div>
			</div>
			
			
		
		</div>
		<!-- Right: End -->
		
		<div class="footer_final">
				
						<div id="footer-info">
							<ul class="column1">
								<li><span>Thủ tục</span></li>
								
								<li href="#">Đăng kí thành viên</li>
								<li href="#">Kích hoạt tài khoản đăng tin</li>
								<li href="#">Đăng ký gian hàng miễn phí</li>
								<li href="#">Đăng tin hỏi đáp</li>
								<li href="#">Muốn bán sản phẩm</li>
								<li href="#">Liên hệ hỗ trợ về sản phẩm</li>
							</ul>
							<ul class="column2">
								<li><span>Bảo vệ người tiêu dùng</span></li>
								<li href="#">Bảo hiểm</li>
								<li href="#">An ninh giao dịch</li>
								<li href="#">Người mới đăng ký</li>
								<li href="#">Phản hồi người tiêu dùng</li>
								<li href="#">Trợ giúp trực tuyến 24h</li>
							</ul>
							<ul class="column3">
								<li><span>Thanh toán</span></li>
								<li href="#">Phương thức thanh toán</li>
								<li href="#">Thiết lập tài khoản thanh toán</li>
								<li href="#">Mua hàng không cần tài khoản</li>
								<li href="#">Thanh toán an toàn</li>
								<li href="#">Nạp tiền tài khoản</li>
								
							</ul>
							
						</div>
					
		</div>
		
		
	</div>
	<!-- Content: End -->
	
	
	
	
</div>

	  
</body>
</html>

